<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>APP</title>
		<link href="css/weui.min.css" rel="stylesheet" />
		<link href="css/jquery-weui.min.css" rel="stylesheet" />
		<link href="css/style.css" rel="stylesheet" />
		<link href="css/flex.css" rel="stylesheet" />
		<link href="fonts/iconfont.css" rel="stylesheet" />
		<script src="js/immersed.js"></script>
	</head>
	<script>
		var statusHeight = STATUSBAR_HEIGHT + 44;
		var styleObj = document.createElement('style');
		styleObj.type = 'text/css';
		styleObj.innerHTML=".status-bar-height{height:"+statusHeight+"px}";
		document.getElementsByTagName('HEAD').item(0).appendChild(styleObj);
	</script>
	<style>

		
	</style>

	<body>
		<div id="app"> 

			<div class="xiaoyi-header header-red" id="header">
				<div class="xiaoyi-header-left"><i class="iconfont icon-back" onclick="wsClose()"></i></div>
				<div class="xiaoyi-header-title">我的收藏</div>
				<!--<div class="xiaoyi-header-right"><i class="iconfont icon-search"></i></div>-->
			</div>
			
			<div class="status-bar-height"></div>
			<template v-for=" (vo,index) in items ">
				<div class="goods-item line-bottom" @click="showGoods(vo.goods.id)"> 
					<div class="title" v-html="vo.goods.title"></div>
					<div class="brief" v-html="vo.goods.brief"></div>
					<div class="price"><span>成本价：</span>&yen;{{vo.goods.cost}}<span style="margin-left: 20px;">珠宝玉石价：</span>&yen;{{vo.goods.price}}</div>
					<div class="pics">
						<div class="img" v-for="(v,index) in vo.goods.pics ">
							<img class="lazy" :data-original="v+'@!200x200'" src="images/nopic.gif" v-if="index < 4">
						</div>
						<div style="clear: both;"></div>
					</div>
					<div class="tools" flex="">
						<span flex-box="0" class="time">{{vo.time}}</span>
						<span flex-box="1"></span> 
						<span flex-box="0" class="favor" @click.stop="favor(vo.goods.id,index)" v-if="vo.goods.is_favor != null" style="color: #45a75c;"><i class="iconfont icon-favorfill"></i> 收藏</span>
						<span flex-box="0" class="favor" @click.stop="favor(vo.goods.id,index)" v-else><i class="iconfont icon-favor"></i> 收藏</span>
						<span flex-box="0" class="share" @click.stop="share(index)"><i class="iconfont icon-share"></i> 转发</span>
					</div>
				</div>
			</template> 

			<template v-if="loading == 'inits'">
				<div flex="main:center cross:center" style="width:100%; height: 400px; ">
					<div class="jushi-loader">Loading...</div>
				</div>
			</template>

			<template v-if="loading == 'nodata'">
				<div flex="main:center cross:center" style="width:100%; height: 400px; ">
					<img src="images/nodata.png" style="width: 150px;">
				</div>
			</template>

			<template v-if="loading == 'more'">
				<div class="weui-loadmore">
					<i class="weui-loading"></i>
					<span class="weui-loadmore__tips">加载更多</span>
				</div>
			</template>

			<template v-if="loading == 'more_nodata'">
				<div class="weui-loadmore weui-loadmore_line">
					<span class="weui-loadmore__tips" style="background: #eee;">没有啦</span>
				</div>
			</template>


		</div>
		
		<div id="toTop" onclick="Top()">
				<i class="iconfont icon-top"></i>
			</div>
			
			
		<script src="js/mui.min.js"></script>
		<script src="js/jquery-2.1.4.js"></script>
		<script src="js/jquery-weui.min.js"></script>
		<script src="js/vue.js"></script>
		<script src="js/smarge.js"></script>
		<script src="js/jquery.lazyload.js"></script>
		<script src="js/systemShare.js"></script>
		<script src="js/wxShare.js"></script>
		<script src="js/md5.min.js"></script>
		<script src="js/common.js"></script>
		<script src="js/smarge.js"></script>
		<script type="text/javascript" charset="utf-8">
			mui.init();
			
			var vm;
			
			function getInits(){
				vm.inits();
			}
			
			mui.plusReady(function() {
				vm = new Vue({
					el: "#app",
					data: {
						items: [],
						loading: 'inits', 
						p: 1,
						r: 20
					},
					mounted: function() {
						this.inits();
					},
					methods: {
						inits: function() {
							var vm = this;
							Get(SERVER_URL +"&c=Favor&a=favorlist", { 
								p: 1,
								r: vm.r, 
							}, function(data) {
								if(data.status) {
									vm.items = data.info;
									vm.p = 2;
									if(data.info.length<4){
										vm.loading = 'noshow';
									}else{
										vm.loading = 'more';
									}
									vm.$nextTick(function(){
							 				$("img.lazy").lazyload({
												container: $(document.body),
											});
							 			})
								} else {
									vm.loading = 'nodata';
								}
							})
							
							var loading = false ;
							$(document.body).infinite(150).on("infinite", function() { 
								if(loading) return;
								loading = true;
								Get(SERVER_URL +"&c=Favor&a=favorlist",{
									p: vm.p,
									r: vm.r,
								}, function(data) {
									if(data.status) {
										for(var i in data.info) { 
											vm.items.push(data.info[i]);
										}
										vm.p++;
										loading = false;
										vm.$nextTick(function(){
							 				$("img.lazy").lazyload({
												container: $(document.body),
											});
							 			})
									} else {
										vm.loading = 'more_nodata';
										loading = false;
									}

								})

							});
							

							$(document).scroll(function() {
								var scrollTop = $(this).scrollTop();
								if(scrollTop > 1500) {
									$("#toTop").show();
								} else {
									$("#toTop").hide();
								}
							});

							
						},
						showGoods: function(id) {
							clicked('goods_details.html?id='+id, 'pop-in'); 
						},
						favor : function(id,index){ 
							Get(SERVER_URL+"&c=Favor&a=setFavor",{id:id},function(data){
								if(data.status){
									if(data.info == 'add') {
										vm.$set(vm.items[index].goods, 'is_favor', 1)
									}
									if(data.info == 'delete') {
										vm.$set(vm.items[index].goods, 'is_favor', null)
										vm.items.splice(index, 1);
										vm.$nextTick(function(){
							 				$("img.lazy").lazyload({
												container: $(document.body),
											});
							 			})
									}
								}
							})
						},
						share : function(index){
							var vm = this;
							var goodsInfo = vm.items[index].goods
							if(plus.os.name == 'Android') {
								plus.nativeUI.actionSheet({
									title: "分享",
									cancel: "取消",
									buttons: [{
										title: "一键转发"
									}, {
										title: "转发链接"
									}, {
										title: "下载组图"
									}, {
										title: "复制描述"
									}]
								}, function(e) {
									var index = e.index;
									switch(index) {
										case 0:
											break;
										case 1:
											easyShare(goodsInfo.pics, '【价格】' + goodsInfo.price + '\n【描述】' + goodsInfo.brief);
											break;
										case 2:
											shareLink(goodsInfo.brief + ',' + goodsInfo.price + '元', goodsInfo.pics[0], "http://shop.51jushi.com/index.php?m=Store&c=index&a=goods&id="+ goodsInfo.id);
											break;
										case 3:
											DownloadPics(goodsInfo.pics)
											break;
										case 4:
											copyToClip('【标题】' + goodsInfo.title + '\n【价格】' + goodsInfo.price + '\n【描述】' + goodsInfo.brief);
											break;
										default:
											// 其它
											break;
									}
								});
							}

							if(plus.os.name == 'iOS') {
								plus.nativeUI.actionSheet({
									title: "分享",
									cancel: "取消",
									buttons: [{
											title: "一键转发"
										},
										{
											title: "转发链接"
										},
										{
											title: "下载组图"
										},
										{
											title: "复制描述"
										}
									]
								}, function(e) {
									var index = e.index;
									switch(index) {
										case 0:
											break;
										case 1:
											copyToClip('【标题】' + goodsInfo.title + '\n【价格】' + goodsInfo.price + '\n【描述】' + goodsInfo.brief);
											jushiShare.share(goodsInfo.pics)
											break;
										case 2:
											jushiShare.share(goodsInfo.pics[0], "http://shop.51jushi.com/index.php?m=Store&c=index&a=goods&id="+ goodsInfo.id, goodsInfo.brief + ',' + goodsInfo.price + '元')
											break;
										case 3:
											DownloadPics(goodsInfo.pics)
											break;
										case 4:
											copyToClip('【标题】' + goodsInfo.title + '\n【价格】' + goodsInfo.price + '\n【描述】' + goodsInfo.brief);
											break;
										default:
											// 其它
											break; 
									}
								});
							}
						}
					}
				})

			});
		</script>
	</body>

</html>